import React, { useEffect } from 'react';
import { history } from 'umi';
// import { useNavigate } from 'react-router-dom'
import * as echarts from 'echarts';
import './index.css';

// 客户来源统计
export default function Index(props) {
  // const navigate = useNavigate()
  const init = () => {
    var myChart = echarts.init(document.getElementById('kh'));
    myChart.setOption({
      tooltip: {
        trigger: 'item',
      },
      legend: {
        orient: 'vertical',
        left: 'left',
      },
      series: [
        {
          name: '客户数量',
          type: 'pie',
          radius: ['40%', '70%'],
          itemStyle: {
            borderRadius: 10,
            borderColor: 'white',
          },
          data: [
            { value: 1048, name: '现有客户' },
            { value: 735, name: '当地咨询' },
            { value: 580, name: '网络平台' },
            { value: 484, name: '展会' },
            { value: 300, name: '外出拜访' },
            { value: 300, name: '供应商' },
            { value: 300, name: '市场挖掘' },
            { value: 300, name: '推广' },
          ],
        },
      ],
    });
  };
  useEffect(() => {
    init();
  }, []);
  return (
    <div className="customer" style={{ backgroundColor: 'white' }}>
      <div className="customertitle">
        <span>客户来源统计</span>
        <img
          onClick={() => {
            let obj = { key: '/home/bkn', name: '客户来源统计' };
            history.push('/home/bkh');
          }}
          src=""
          alt=""
        />
      </div>
      <div id="kh" style={{ width: '100%', height: '400px' }}></div>
    </div>
  );
}
